<template>
	<view>
		<view class="od-box">
			<view class="od-title">
				案件主体信息
				<slot name="case-edit" style="width: 50rpx;"></slot>
			</view>
      <view class="tishi" v-if="userInfo.is_weituo =='1'&&(info.order.status == 1 || info.order.status == 2 || info.order.status == 13 || info.order.status == 18 || info.order.status == 19 || info.order.status == 20)" >
        <view class="tishi_vicoe">
          <image class="vicoe" src="@/static/img/tongzhi@2x.png"></image>
        </view>
        <view class="vioce_content">
          <view class="vioce_item">
            1.到“项目资料”里，上传您手上有的材料;
          </view>
          <view class="vioce_item">
            2.填写“委托人诉求”;
          </view>
          <view class="vioce_item">
            请您先按以上流程操作，以便法务专员为您快速审查、修改订单，精准匹配律师。
          </view>
        </view>
      </view>
      <view class="case-title"style="display: flex;align-items: center;justify-content: space-between;">
        <view style="display: flex;align-items: center;">
        项目资料</view>
        <view class="item-right" v-if="userInfo.is_touziren=='1'||userInfo.is_lawyer=='1'" @click="goUpload(info.order.self_ident_copy,info.order.id)">
<!--            @click="jump('/pages/client/order/project-data-info2', { card_images: info.order.card_images,liaotian_images:info.order.liaotian_images,jietiao_images: info.order.jietiao_images,cuishou_images:info.order.cuishou_images,other_images:info.order.other_images,huan_images:info.order.huan_images,shenfen_images:info.order.shenfen_images,zanzhuzheng_doc:info.order.zanzhu,type:info.price_type=='自费'? 2 : 1,id:info.order.id,btmbtns:btmbtns  })"-->
          <view
              v-if="info.order.self_ident=='收款方'"
              class="item-right"
            >
           <view class="item-txt" :class="info.order.card_images!='' || info.order.liaotian_images!='' || info.order.jietiao_images!='' || info.order.cuishou_images!='' || info.order.other_images!=''||info.order.source.length>0?'':'gray'">{{ info.order.card_images!='' || info.order.liaotian_images!='' || info.order.jietiao_images!='' || info.order.cuishou_images!='' || info.order.other_images!=''||info.order.source.length>0?'查看、修改案件资料':'无' }}</view>
            <view class="item-nav"><image src="@/static/img/right.png" mode="aspectFit"></image></view>
          </view>
<!--          @click="jump('/pages/client/order/upload', { source: JSON.stringify(info.order.source),readOnly:true,btmbtns:btmbtns  })"-->
          <view v-else class="item-right" >
            <view class="item-txt" :class="info.order.card_images!='' || info.order.liaotian_images!='' || info.order.jietiao_images!='' || info.order.cuishou_images!='' || info.order.other_images!=''||info.order.source.length>0?'':'gray'">{{ info.order.card_images!='' || info.order.liaotian_images!='' || info.order.jietiao_images!='' || info.order.cuishou_images!='' || info.order.other_images!=''||info.order.source.length>0?'查看、修改案件资料':'无' }}</view>
            <view class="item-nav"><image src="@/static/img/right.png" mode="aspectFit"></image></view>
          </view>
        </view>
        <view  class="item-right" v-else>
          <view
              class="item-right"
              @click="goUpload(info.order.self_ident_copy,info.order.id)"
          >
            <view class="item-txt" v-if="userInfo.is_fawu =='1'"  :class="((info.order.card_images!='' || info.order.liaotian_images!='' || info.order.jietiao_images!='' || info.order.cuishou_images!='' || info.order.other_images!='')||info.order.source.length>0)?'':'gray'">{{ (info.order.card_images!='' || info.order.liaotian_images!='' || info.order.jietiao_images!='' || info.order.cuishou_images!='' || info.order.other_images!='')||info.order.source.length>0?'查看、修改案件资料':'请联系委托人上传资料'}}</view>
            <view class="item-txt" v-if="userInfo.is_weituo =='1'"  :class="info.order.card_images!='' || info.order.liaotian_images!='' || info.order.jietiao_images!='' || info.order.cuishou_images!='' || info.order.other_images!=''||info.order.source.length>0?'':'gray'">{{ (info.order.card_images!='' || info.order.liaotian_images!='' || info.order.jietiao_images!='' || info.order.cuishou_images!='' || info.order.other_images!='')||info.order.source.length>0?'查看、修改案件资料':'请上传案件资料' }}</view>
            <view class="item-nav" v-if="!iswancheng"><image src="@/static/img/right.png" mode="aspectFit" ></image></view>
          </view>
        </view>
      </view>
			<view  class="case-title" :class="requirement&&requirement.length>10 ?'algintop':''" style="display: flex;align-items: center;justify-content: space-between;"><view style="display: flex;align-items: center;">
        委托人诉求<image  src="@/static/img/question.png" mode="" style="width: 30rpx;height: 30rpx" @click="$refs.myrequirePopup.open();" ></image></view>
        <view class="item-right"  @click="userInfo.is_fawu =='1'||userInfo.is_weituo =='1'?toEdit('1'):tokong()"  :class="requirement&&requirement.length>10 ?'algintop':''">
          <view class="item-txt" v-if="(userInfo.is_fawu =='1')&&!requirement" @click="toEdit('1')"  :class="requirement?'zidong':'gray'">询问委托人要律师帮ta实现什么结果</view>
          <view class="item-txt" v-if="(userInfo.is_weituo =='1')&&!requirement" @click="toEdit('1')"  :class="requirement?'zidong':'gray'">您要律师帮您实现什么结果</view>
          <view class="item-txt" v-if="(userInfo.is_lawyer =='1'||userInfo.is_touziren =='1')&&!requirement" :class="requirement?'zidong':'gray'">无</view>
          <view class="item-nav" v-if="userInfo.is_lawyer!='1'&&userInfo.is_touziren!='1'&&!iswancheng" @click="userInfo.is_fawu =='1'||userInfo.is_weituo =='1'?toEdit('1'):tokong()"  :class="requirement&&requirement.length>10 ?'hei15':''"><image src="@/static/img/right.png" mode="aspectFit"></image></view>
        </view>
      </view>
      <view class="od-item marginbottom10 require-onwer zidong" v-if="requirement">
        {{ requirement}}
      </view>
      <view  v-if="clientInfo.length>0&&!clientInfo[0].self_name" class="case-title"style="display: flex;align-items: center;justify-content: space-between;"><view style="display: flex;align-items: center;">
        委托人</view>
        <view class="item-right" @click="userInfo.is_fawu =='1'?toEdit('2'):tokong()">
          <view class="item-txt gray" v-if="userInfo.is_fawu =='1'">跟委托人确认后填写</view>
          <view class="item-txt gray" v-if="userInfo.is_lawyer =='1'||userInfo.is_touziren =='1'">无</view>
          <view class="item-txt gray" v-if="userInfo.is_weituo =='1'">请联系法务专员为您填写</view>
          <view class="item-nav"  v-if="userInfo.is_fawu =='1'&&!iswancheng"><image src="@/static/img/right.png" mode="aspectFit"></image></view>
        </view>
      </view>
			<template v-if="clientInfo.length>0&&clientInfo[0].self_name"   v-for="(item, index) in clientInfo" v-key="index">
				<view class="case-title" @click="userInfo.is_fawu =='1'?toEdit('2'):tokong()">委托人{{clientInfo.length>1?(index+1):''}}  <view class="item-nav" v-if="userInfo.is_fawu =='1'&&!iswancheng"><image src="@/static/img/right.png" mode="aspectFit"></image></view></view>
				<view class="od-item marginbottom10">
					<view class="item-tip require">类型</view>
					<view class="item-right" style="align-items: center;justify-content: flex-start">
						<text v-if="item.self_type">自然人</text>
						<text v-if="!item.self_type">非自然人</text>
					</view>
				</view>
				<view class="od-item marginbottom10">
					<view class="item-tip require">身份</view>
					<view class="item-right">
						<view class="service-list inline-list" style="align-items: center" v-if="item.self_shenfen">
							{{ item.self_shenfen }}
						</view>
						<view class="item-txt gray" v-else>无</view>
					</view>
				</view>
				<view class="od-item marginbottom10">
					<view class="item-tip require" v-if="item.self_type">姓名</view>
					<view class="item-tip require" v-if="!item.self_type">名称</view>
					<view class="item-right">
						<view class="item-txt"><input disabled type="text" class="ipts" value="" placeholder="无"
								placeholder-class="placeholder" v-model="item.self_name" /></view>
					</view>
				</view>
				<view class="od-item marginbottom10">
					<view class="item-tip require" v-if="item.self_type">证件号码</view>
					<view class="item-tip require" v-if="!item.self_type">联系人</view>
					<view class="item-right" v-if="item.self_type">
						<view class="item-txt"><input disabled type="number" class="ipts" value="" placeholder="无"
								placeholder-class="placeholder" v-model="item.self_code" /></view>
					</view>
					<view class="item-right" v-if="!item.self_type">
						<view class="item-txt"><input disabled type="text" class="ipts" value="" placeholder="无"
								placeholder-class="placeholder" v-model="item.self_code" /></view>
					</view>
				</view>
				<view class="od-item marginbottom10">
					<view class="item-tip require">联系电话</view>
					<view class="item-right">
						<view class="item-txt"><input disabled type="tel" class="ipts" value="" placeholder="无"
								placeholder-class="placeholder" v-model="item.self_tel" /></view>
					</view>
				</view>
			</template>
      <view v-if="otherInfoLIst.length>0&&!otherInfoLIst[0].dui_name" class="case-title"style="display: flex;align-items: center;justify-content: space-between;"><view style="display: flex;align-items: center;">
        对方当事人</view>
        <view class="item-right" @click="userInfo.is_fawu =='1'?toEdit('3'):tokong()">
          <view class="item-txt gray" v-if="userInfo.is_fawu =='1'">跟委托人确认后填写</view>
          <view class="item-txt gray" v-if="userInfo.is_lawyer =='1'||userInfo.is_touziren =='1'">无</view>
          <view class="item-txt gray" v-if="userInfo.is_weituo =='1'">请联系法务专员为您填写</view>
          <view class="item-nav" v-if="userInfo.is_fawu =='1'&&!iswancheng"><image src="@/static/img/right.png" mode="aspectFit"></image></view>
        </view>
      </view>
			<template  v-if="otherInfoLIst.length>0&&otherInfoLIst[0].dui_name" v-for="(item, index) in otherInfoLIst" v-key="index">
				<view class="case-title"  @click="userInfo.is_fawu =='1'?toEdit('3'):tokong()">对方当事人{{otherInfoLIst.length>1?(index+1):''}}  <view class="item-nav" v-if="userInfo.is_fawu =='1'&&!iswancheng"><image src="@/static/img/right.png" mode="aspectFit"></image></view></view>
				<view class="od-item marginbottom10">
					<view class="item-tip require">类型</view>
					<view class="item-right" style="align-items: center;justify-content: flex-start">
						<text v-if="item.dui_type">自然人</text>
						<text v-if="!item.dui_type">非自然人</text>
					</view>
				</view>
				<view class="od-item marginbottom10">
					<view class="item-tip require" v-if="item.dui_type">姓名</view>
					<view class="item-tip require" v-if="!item.dui_type">名称</view>
					<view class="item-right">
						<view class="item-txt"><input disabled type="text" class="ipts" value="" placeholder="无"
								placeholder-class="placeholder" v-model="item.dui_name" /></view>
					</view>
				</view>
				<view class="od-item marginbottom10">
					<view class="item-tip require" v-if="item.dui_type">证件号码</view>
					<view class="item-tip require" v-if="!item.dui_type">联系人</view>
					<view class="item-right" v-if="item.dui_type">
						<view class="item-txt"><input disabled type="number" class="ipts" value="" placeholder="无"
								placeholder-class="placeholder" v-model="item.dui_code" /></view>
					</view>
					<view class="item-right" v-if="!item.dui_type">
						<view class="item-txt"><input disabled type="text" class="ipts" value="" placeholder="无"
								placeholder-class="placeholder" v-model="item.dui_code" /></view>
					</view>
				</view>
				<view class="od-item marginbottom10">
					<view class="item-tip require">联系电话</view>
					<view class="item-right">
						<view class="item-txt"><input disabled type="tel" class="ipts" value="" placeholder="无"
								placeholder-class="placeholder" v-model="item.dui_tel" /></view>
					</view>
				</view>
			</template>
		</view>
    <uni-popup ref="myrequirePopup" type="bottom" @change="removeCss($event)">
      <view class="popup-bottom-box">
        <view class="bot-title">
          <view class="title-txt">委托人诉求填写规范</view>
          <view class="title-close" @click="closePop('myrequirePopup')">
            <view class="image-wrapper">
              <image src="@/static/img/close.png" mode="aspectFit"></image>
            </view>
          </view>
        </view>
        <scroll-view scroll-y="true" class="bot-con" style="height:300rpx">
          <view class="bot-title-box">
            <view class="icon-box"></view>
            <view class="title-text-box">范例</view>
          </view>
          <view class="bot-content-box">
            我要陈冠希还我借款200元</br>
            我要彭于晏赔偿我人身损害费300元</br>
            我要阿里巴巴给我货款30万元</br>
            我要与林志玲离婚，要抚养权，分财产</br>
            柳岩告我，要我赔偿精神损失费，没有道理，要求打赢</br>
          </view>
        </scroll-view>
        <view class="bot-save">
          <view class="save-box" @click="closePop('myrequirePopup')">朕知道了</view>
        </view>
      </view>
    </uni-popup>
	</view>
</template>

<script>
import { mapGetters, mapMutations } from 'vuex';
	export default {
    props:{
      info:{
        type: Object,
        default: {}
      },
      iswancheng: {
        type: Boolean,
        default: true
      },
      statused:{
        type: String,
        default: '50'
      }
    },
		data() {
			return {
        isTan:false,
        btmbtns:true,
        istrue:false,//是否有项目资料
				requirement: '', //委托人诉求
				showIdent: false,
				infoIdent: [], //我的身份选择
				my_ident: {}, //我的身份
				clientInfo: [{
					self_name: '', //姓名
					self_code: '', //证件号码
					self_tel: '' ,//联系电话
					self_type:true,
				}],
				otherInfoLIst: [{
					dui_name: '', //姓名
					dui_code: '', //证件号码
					dui_tel: '' ,//联系电话
					dui_type:true,
				}]
			};
		},
		created() {
			this.init2();
      setTimeout(()=>{
        console.log("=info.self_ident",this.info)
        console.log("==12",(this.info.order.card_images!='' || this.info.order.liaotian_images!='' || this.info.order.jietiao_images!='' || this.info.order.cuishou_images!='' || this.info.order.other_images!='')||this.info.order.source.length>0)
        console.log("==12",(this.info.order.card_images!='' || this.info.order.liaotian_images!='' || this.info.order.jietiao_images!='' || this.info.order.cuishou_images!='' || this.info.order.other_images!=''))
        console.log("===||this.info.order.source.length>0",this.info.order.source.length>0)

      },200)
		},
    computed: {
      ...mapGetters(['userInfo'])
    },
		methods: {
      toEdit(type){
        this.$emit('toedit',type)
      },
      tokong(){
        console.log("==kong不能删除")},
			async init2() {
				// 案件主体初始化
				this.requirement = this.info.order.requirement;
				console.log(this.info)
				this.my_ident = {
					value: this.info.order.my_ident||'',
					label: this.info.order.my_ident_parent_text&&this.info.order.my_ident_text?`${this.info.order.my_ident_parent_text} ${this.info.order.my_ident_text}`:''
				};
				console.log("*****",this.info.order.weituo_json,this.info.order.weituo_json!=='')
				if (this.info.order.weituo_json) {
					this.clientInfo = JSON.parse(this.info.order.weituo_json);
				}
				// else{
				// 	this.clientInfo[0] = {
				// 		self_code: this.info.order.self_code||'',
				// 		self_name: this.info.order.self_name||'',
				// 		self_tel: this.info.order.self_tel||'',
				// 		self_type:true
				// 	}
				// }

				console.log(this.info.order.weituo_json,111111111)
				console.log(this.clientInfo,222222222)

				if (this.info.order.dui) {
					this.otherInfoLIst = this.info.order.dui;
				}
			},
      goUpload(slef_type,orderId){
        const nav = navigator.userAgent;
        if(this.iswancheng){
          if(this.info.order.self_ident=='收款方'){
            this.jump('/pages/client/order/project-data-info2', { zanzhuzheng_doc:this.info.order.zanzhu,shenfen_images:this.info.order.shenfen_images,card_images: this.info.order.card_images,liaotian_images:this.info.order.liaotian_images,jietiao_images: this.info.order.jietiao_images,cuishou_images:this.info.order.cuishou_images,other_images:this.info.order.other_images,huan_images:this.info.order.huan_images,type:this.info.order.price_type=='自费'? 2 : 1,id:this.info.order.id,isTan:this.isTan })
          }else{
            this.jump('/pages/client/order/upload', { source: JSON.stringify(this.info.order.source),isTan:this.isTan,readOnly:true })
          }
        }else {
          if (nav.indexOf('Android') > -1 || nav.indexOf('Adr') > -1) {
            if (this.userInfo.is_fawu == '1') {
              phone.fawuPickPhotoEidt(JSON.stringify({orderId: orderId, slef_type: slef_type}));
            } else if (this.userInfo.is_weituo == '1') {
              phone.weituoPickPhotoEidt(JSON.stringify({orderId: orderId, slef_type: slef_type}));
            }
          } else if (!!nav.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
            if (this.userInfo.is_fawu == '1') {
              this.$bridge.callhandler('fawuPickPhotoEidt', {orderId: orderId, slef_type: slef_type}, data => {
              });
            } else if (this.userInfo.is_weituo == '1') {
              this.$bridge.callhandler('weituoPickPhotoEidt', {orderId: orderId, slef_type: slef_type}, data => {
              });
            }

          }
        }

      },
      // 打开摄像头
      camera() {

      },
      //选择照片
      pickPhoto() {
        const nav = navigator.userAgent;
        if (nav.indexOf('Android') > -1 || nav.indexOf('Adr') > -1) {
          phone.pickPhotoEidt();
        } else if (!!nav.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
          this.$bridge.callhandler('pickPhotoEidt', {isCanEdit:true}, data => {
            let tempList = this.trimSpace(data);
            console.log(tempList,'-----选择照片tempList')
            this.source = this.source.concat(tempList);
          });
        }
      },

		}
	};
</script>

<style lang="scss">
	.od-title {
		display: flex;
	}
	.item-tip{
		line-height: 58rpx;
    width: 226rpx;
	}
  .tishi{
    display: flex;
    align-items: center;
    background: #FFECEC;
    border-radius: 5px;
    padding: 10px 12px;
    margin: 10rpx 0;
    .tishi_vicoe{
      width: 100rpx;
      height: 50rpx;
      margin-right: 28rpx;
      .vicoe{
        width: 100%;
        height: 100%;
      }
    }
    .vioce_content{
      font-size: 24rpx;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: #FF0000;
      line-height:40rpx;
    }
  }
	.case-title {
		position: relative;
    line-height: 31px;
    display: flex;
    justify-content: space-between;
		.title-del {
			.image-wrapper {
				width: 35rpx;
				height: 35rpx;

				image {
					vertical-align: middle;
					width: 100%;
					height: 100%;
				}
			}

			float: right;
		}
    .item-nav{
      width: 8px;
      margin-left: 10px;
      opacity: 0.4;
      uni-image{
        width: 100%;
        height: 100%;
      }
    }
		//&::before {
		//	content: '';
		//	position: absolute;
		//	width: 10rpx;
		//	height: 25rpx;
		//	background-color: $uni-color-primary;
		//	border-radius: 40rpx;
		//	left: 0;
		//	top: 8rpx;
		//}
	}
  .od-box .od-item{
    display: flex;
    align-items: center;
  }
  .od-box .od-item .item-right .item-txt{margin-left:0!important;align-items: center;}
  ::v-deep .textarea {
    height: 120rpx !important;
  }
  ::v-deep .ipt{
    margin-top:0!important;
  }
  ::v-deep .require-onwer{
    line-height: 44rpx;
  }
  .gray{
    color: #aaa;
  }
  .popup-bottom-box {
    background-color: #ffffff;
    overflow: auto;
    overflow-x: hidden;
    .bot-title {
      display: flex;
      align-items: center;

      .title-txt {
        flex: 1;
        text-align: center;
        padding: 20rpx;
        font-weight: bold;
      }

      .title-close {
        width: 80rpx;
        height: 80rpx;
        text-align: center;
        position: absolute;
        top: 0;
        right: 0;
        display: flex;
        align-items: center;
        justify-content: center;

        .image-wrapper {
          width: 26rpx;
          height: 26rpx;
          vertical-align: middle;

          image {
            width: 100%;
            height: 100%;
          }
        }
      }
    }
    .remark-box{
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 60rpx;
      color: #777777;
      font-size: 24rpx;
    }
    .select-box{
      padding: 0rpx 40rpx;
      height: 100rpx;
      width: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
      .input-box{
        width: 530rpx;
        height: 60rpx;
        border: 1rpx solid #DCDCDC;
        border-radius: 6rpx;
        background: rgba(245, 245, 245, 0.59);
      }
      .input-placeholder-box{
        margin-left: 40rpx;
      }
      .select-all-box{
        width: 120rpx;
        height: 50rpx;
        border: 1rpx solid #F9B804;
        color: #F9B804;
        display: flex;
        justify-content: center;
        align-items: center;

      }
    }
    .assistant-title-box{
      margin-left: 140rpx;
      height: 30rpx;
      color: #777777;
      font-size: 24rpx;
    }
    .bot-con-no{
      height: 520rpx;
      text-align: center;
      padding-top: 64px;
      color: #aaa;
    }
    ::v-deep .uni-input-input{
      padding:0 18rpx;
    }
    .bot-con {
      padding: 0 30rpx;
      height: 800rpx;
      // overflow-y: scroll;
      width: calc(100% - 60rpx);
      .service-list {
        margin-bottom: 20rpx;
      }
      .bot-title-box{
        display: flex;
        align-items: center;
        .icon-box{
          width: 12rpx;
          height: 30rpx;
          background: #FFC900;
          opacity: 1;
          border-radius: 6rpx;
        }
        .title-text-box{
          margin-left: 5rpx;
          height: 45rpx;
          font-size: 32rpx;
          font-family: PingFang SC;
          font-weight: bold;
          color: #000000;
          opacity: 1;
        }
        .bot-content-box{
          margin: 10rpx 0rpx 10rpx 17rpx;
          font-size: 24rpx;
          font-family: PingFang SC;
          font-weight: 400;
          color: rgba(0,0,0,0.6);
          opacity: 1;
          span{
            color: #000;
            font-weight: 600;
          }
        }
      }
      .bot-title-two-box{
        display: flex;
        .icon-box{
          margin-top: 5rpx;
          width: 12rpx;
          height: 30rpx;
          background: #FFC900;
          opacity: 1;
          border-radius: 6rpx;
        }
        .bot-content-box{
          margin: 0rpx 0rpx 0rpx 17rpx;
          font-size: 24rpx;
          font-family: PingFang SC;
          font-weight: 400;
          line-height: 40rpx;
          color: rgba(0,0,0,0.6);
          opacity: 1;
          span{
            color: #000;
            font-weight: 600;
          }
        }
      }
      .bot-content-box{
        margin: 10rpx 0rpx 10rpx 17rpx;
        font-size: 24rpx;
        font-family: PingFang SC;
        font-weight: 400;
        color: rgba(0,0,0,0.6);
        opacity: 1;
        span{
          color: #000;
          font-weight: 600;
        }
      }
      .bot-content-img-box{
        margin: 10rpx 0rpx 10rpx 17rpx;
        display: flex;
        image{
          width: 300rpx;
          height: 420rpx;
        }
      }
      .line-box{
        width: 100%;
        height: 1rpx;
        border: 1px solid #D5D5D5;
        background-color: #D5D5D5;
        margin: 15rpx 0rpx;
      }
      .stage-item-box{
        width: 100%;
        height: 60rpx;
        margin: 20rpx 0rpx;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .left-box{
          display: flex;
          align-items: center;
          .icon-box{
            width: 12rpx;
            height: 30rpx;
            background: #FFC900;
            opacity: 1;
            border-radius: 6rpx;
          }
          .title-box{
            margin-left: 5rpx;
            font-size: 32rpx;
            font-family: PingFang SC;
            font-weight: bold;
            color: #000000;
          }
        }
        .right-box{
          width: 16rpx;
          height: 40rpx;
          margin-left: 20rpx;
          image {
            width: 100%;
            height: 100%;
            vertical-align: middle;
          }
        }
      }
      .lang-item-box{
        margin: 10rpx 0rpx 10rpx 40rpx;
        width: calc(100% - 20rpx);
        height: 80rpx;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .icon-box{
          width: 40rpx;
          height: 40rpx;
          image {
            width: 100%;
            height: 100%;
          }
        }
        .content-box{
          width: calc(100% - 100rpx);
          height: 80rpx;
          line-height: 80rpx;
          border-bottom: 2rpx solid rgba(136,136,136,0.6);
        }
      }
      .lawyer-con {
        margin-bottom: 20rpx;
        display: flex;
        border-radius: 30rpx;
        border: 1rpx solid #DCDCDC;
        padding: 10rpx 20rpx;
        // box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.16);
      }
      .lawyer-left {
        font-weight: bold;
        width: 100rpx;
        margin-right: 30rpx;
        .image-wrapper {
          width: 100rpx;
          height: 100rpx;
          border-radius: 20rpx;
          overflow: hidden;
          image {
            width: 100%;
            height: 100%;
          }
        }
      }
      .lawyer-right {
        flex: 1;
        .lawyer-name {
          display: flex;
          margin-bottom: 20rpx;
          justify-content: space-between;
          .name-left {
            font-size: 16px;
            font-weight: bold;
            margin-right: 10px;
          }
          .name-right {
            padding-left: 10rpx;
            .image-wrapper {
              width: 30rpx;
              height: 30rpx;
              image {
                vertical-align: middle;
                width: 100%;
                height: 100%;
              }
            }
          }
          .name-center {
            flex: 1;
          }
        }
        .lawyer-tip {
          margin-bottom: 20rpx;
          color: #666666;
          font-size: 24rpx;
        }
        .lawyer-item {
          margin-bottom: 10rpx;
          display: flex;

          .item-left {
            margin-right: 10rpx;
            .image-wrapper {
              width: 30rpx;
              height: 30rpx;
              image {
                width: 100%;
                height: 100%;
              }
            }
          }
          .item-txt {
            color: #aaa;
            font-size: 24rpx;
            flex: 1;
          }
        }
      }
    }
    .bot-save{
      width: 100%;
      height: 102rpx;
      background: rgba(255, 255, 255, 0.39);
      box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.16);
      opacity: 1;
      display: flex;
      justify-content: center;
      align-items: center;
      .save-box{
        width: 60%;
        height: 60rpx;
        // border-radius: 30rpx;
        background-color: #F9B804;
        color: #fff;
        font-size: 24rpx;
        font-family: PingFang SC;
        font-weight: bold;
        display: flex;
        justify-content: center;
        align-items: center;
      }
    }
    .bot-select-con{
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      margin: 20rpx 0rpx;
      .select-item-box{
        width: 50%;
        height: 60rpx;
        margin: 10rpx 0rpx;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      // 选中
      .pitch-on{
        border:1px solid #F9B804;
        color: #F9B804;
      }
      // 未选中
      .un-pitch{
        border:1px solid #DDDDDD;
        color: #222222;
      }
    }
    .stage-scroll-box{
      max-height: 600rpx;
      padding-left: 15%;
      margin: 20rpx 0rpx;
      .select-item-box{
        width: 70%;
        height: 60rpx;
        margin: 10rpx 0rpx;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      // 选中
      .pitch-on{
        border:1px solid #F9B804;
        color: #F9B804;
      }
      // 未选中
      .un-pitch{
        border:1px solid #DDDDDD;
        color: #222222;
      }
    }
  }
  .item-right{
    display: flex;
    flex-wrap: wrap;
    flex: 1;
    justify-content: flex-end;
    .item-txt{

    }
    .gray{
      color: #cccccc;
    }
  .item-nav{
    width: 8px;
    margin-left: 10px;
    opacity: 0.4;
  uni-image{
    width: 100%;
    height: 100%;
  }
  }
  }
  .zidong{
    word-wrap:break-word;
    word-break:break-all;
  }
  .algintop{
    align-items: flex-start!important;
  }
  .hei15{
    height: 15px;
  }
</style>
